<template>
  <el-card>
    <div class="item">
      <div class="left">资讯内容</div>
      <div class="right html br-1 bs-bb">
        <div class="title txt-c">{{ data.title }}</div>
        <div class="grid-1">
          <div class="left_ar">{{ data.createByName }}</div>
          <div class="right_ar">{{ data.createTime }}</div>
        </div>
        <div v-html="data.details" v-if="data.resourceType == 1"></div>
        <div v-if="data.resourceType == 2">
          <video :src="data.details" controls></video>
        </div>
      </div>
    </div>
    <div class="item" v-if="shenhe">
      <div class="left">审核意见</div>
      <div class="right">
        {{ shenhe }}
      </div>
    </div>
    <div class="item">
      <div class="left"></div>
      <div>
        <div class="btn-deep" @click="$router.go(-1)">返回</div>
      </div>
    </div>
  </el-card>
</template>
<script>
import { encyclopedia_status } from "@/request/api";
export default {
  data() {
    return {
      data: null,
      shenhe: null,
    };
  },
  created() {
    if (JSON.stringify(this.$route.params) != "{}") {
      this.data = this.$route.params;
      encyclopedia_status(this.data.id).then((res) => {
        if (res.code == 200) {
          this.shenhe = res.result?.remarks;
          sessionStorage.setItem(
            "jkgp",
            JSON.stringify({
              data: this.data,
              shenhe: this.shenhe,
            })
          );
        }
      });
    } else if (sessionStorage.getItem('jkgp')) {
      let e = JSON.parse(sessionStorage.getItem('jkgp'));
      this.data = e.data;
      this.shenhe = e.shenhe;
    } else {
      this.$router.push("/encyclopedia");
    }
  },
};
</script>
<style lang="less" scoped>
video {
  width: 100%;
  height: 100%;
}
.grid-1 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  justify-content: center;
  grid-column-gap: 6.25rem;
  margin: 1.25rem 0;
  .left_ar {
    text-align: right;
  }
  .right_ar {
    text-align: left;
  }
}
.title {
  font-size: 1.75rem;
  color: #333333;
  line-height: 2.25rem;
}
.left {
  font-size: 0.875rem;
  color: #333333;
}
.el-card {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
.item {
  display: grid;
  grid-template-columns: 6.25rem 1fr;
  margin-bottom: 1.25rem;
}
.html {
  background: #f1f1f1;
  padding: 2.125rem 7.75rem;
}
</style>